<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ taglib prefix="shiro" uri="http://shiro.apache.org/tags"%>
<script type="text/javascript">
	var role_grid;
	$(function() {
		role_grid = $('#grid')
				.datagrid(
						{
							title : '',
							url : '${ctx}/sys/role/list',
							striped : true,
							rownumbers : true,
							pagination : true,
							singleSelect : true,
							idField : 'id',
							sortName : 'sort',
							sortOrder : 'asc',
							total : 2000,
							frozenColumns : [ [ {
								width : '100',
								title : '角色名称',
								field : 'name',
								sortable : true
							} ] ],
							columns : [ [
									{
										width : '150',
										title : '创建时间',
										field : 'createDate',
										sortable : true
									},
									{
										width : '100',
										title : '创建人',
										field : 'createBy',

									},
									{
										width : '256',
										title : '资源描述',
										field : 'remarks'
									},
									{
										width : '60',
										title : '排序',
										field : 'sort',
										hidden : true,
										sortable : true
									},
									{
										title : '操作',
										field : 'action',
										width : '170',
										formatter : function(value, row) {
											var str = '';
											<shiro:hasPermission name="/sys/role/update/pre">
											str += sy
													.formatString(
															'<span onclick="role_editFun(\'{0}\');" style="margin-left:3px;cursor:pointer;">【{1}】</span>',
															row.id, "修改");
											</shiro:hasPermission>
											<shiro:hasPermission name="/sys/role/delete">
											str += sy
													.formatString(
															'<span onclick="role_removeFun(\'{0}\');" style="margin-left:3px;cursor:pointer;">【{1}】</span>',
															row.id, "删除");
											</shiro:hasPermission>
											<shiro:hasPermission name="/sys/role/update/pre">
											str += sy
													.formatString(
															'<span onclick="role_GrantFun(\'{0}\');" style="margin-left:3px;cursor:pointer;">【{1}】</span>',
															row.id, "授权");
											</shiro:hasPermission>
											return str;
										}
									} ] ],
							toolbar : '#toolbar',
							onBeforeLoad : function(param) {
								parent.$.messager.progress({
									text : '数据加载中....'
								});
							},
							onLoadSuccess : function(data) {
								$('.iconImg').attr('src', sy.pixel_0);
								parent.$.messager.progress('close');
							}
						});
	});

	//删除
	var role_removeFun = function(id) {
		parent.$.messager.confirm('询问', '您确定要删除此记录？', function(r) {
			if (r) {
				$.post('${ctx}/sys/role/delete/' + id, {
					id : id
				}, function() {
					role_grid.datagrid('reload');
				}, 'json');
			}
		});
	};

	//添加
	var role_addFun = function() {
		$('<div/>').dialog({
			href : '${ctx}/sys/role/update/pre',
			width : 640,
			height : 280,
			modal : true,
			title : '添加角色',
			buttons : [ {
				text : '添加',
				iconCls : 'icon-add',
				handler : function() {
					var d = $(this).closest('.window-body');
					$('#role_updateForm').form('submit', {
						url : '${ctx}/sys/role/update',
						success : function(result) {
							try {
								var r = $.parseJSON(result);
								if (r.success) {

									role_grid.datagrid('reload'); // 刷新数据  
									d.dialog('destroy');
								}
								$.messager.show({
									title : '温馨提示',
									msg : r.message
								});

							} catch (e) {
								$.messager.alert('温馨提示', r.message);
								return;
							}

						}

					});
				}

			} ],
			onClose : function() {
				$(this).dialog('destroy');
			}
		});

	};
	//修改
	var role_editFun = function(id) {
		$('<div/>').dialog({
			href : '${ctx}/sys/role/update/pre',
			width : 640,
			height : 280,
			modal : true,
			title : '修改角色',
			buttons : [ {
				text : '修改',
				iconCls : 'icon-add',
				handler : function() {
					var d = $(this).closest('.window-body');
					$('#res_updateForms').form('submit', {
						url : '${ctx}/sys/role/update',
						success : function(result) {
							try {
								var r = $.parseJSON(result);
								if (r.success) {
									role_grid.datagrid('reload'); // 刷新数据  
									d.dialog('destroy');
								}
								$.messager.show({
									title : '温馨提示',
									msg : r.message
								});

							} catch (e) {
								$.messager.alert('温馨提示', r.message);
								return;
							}

						}

					});
				}

			} ],
			onClose : function() {
				$(this).dialog('destroy');
			},
			onLoad : function() {
				$.post('${ctx}/sys/role/selectById', {
					id : id
				}, function(result) {
					if (result != null) {
						$('#role_updateForm').form('load', result);
					}
					$.messager.progress('close');
				}, 'json');

			}
		});
	};

	//授权角色
	var role_GrantFun = function(id, roleName) {
		$("#function-panel").panel({
			title : "当前拥有权限",
			href : "${ctx}/sys/role/grant/tree/pro?id=" + id
		});
		//$('#function-panel').panel("refresh" );	
	};
</script>
<!-- 界面布局  -->
<div class="easyui-layout" style="width: 100%; height: 100%;"
	data-options="fit:true,border:false">
	<div id="toolbar" style="display: none;">
		<table>
			<tr>
				<shiro:hasPermission name="/sys/role/update/pre">
					<td><a href="javascript:void(0);" class="easyui-linkbutton"
						data-options="iconCls:'icon-add',plain:true"
						onclick="role_addFun();">添加</a></td>
				</shiro:hasPermission>
				<td><div class="datagrid-btn-separator"></div></td>
				<td><input id="searchBox" class="easyui-searchbox"
					style="width: 150px"
					data-options="searcher:function(value,name){role_grid.datagrid('load',{'QUERY_t#name_S_LK':value});},prompt:'搜索角色名称'"></input></td>
				<td><a href="javascript:void(0);" class="easyui-linkbutton"
					data-options="iconCls:'icon-cancel',plain:true"
					onclick="$('#searchBox').searchbox('setValue','');grid.datagrid('load',{});">清空查询</a></td>
			</tr>
		</table>
	</div>
	<div data-options="region:'center',title:'角色列表'" style="padding: 2px;">
		<div class="easyui-layout" data-options="fit : true,border : false">
			<div data-options="region:'center',border:false">
				<table id="grid" data-options="fit:true,border:false"></table>
			</div>
		</div>
	</div>

	<div data-options="region:'east', split:true" style="width: 300px;">
		<div class="easyui-panel"
			data-options="fit:true,border:false,title:'权限设置'"
			style="padding: 10px;" id="function-panel"></div>
	</div>

</div>

